import React, { Component } from 'react'
import { myGet, myPost } from '../myFetch'

export default class Http extends Component {
  constructor() {
    super()
    this.state = {

    }
  }
  postFn() {
    this.http.post('/api/cartadd', {
      type: 7
    })
    .then(res => {
      console.log(res.data);
    })
  }
  getFn() {
    this.http('/api/getnew')
    .then(res => {
      console.log(res.data);
    })
  }
  getFetch() {
    fetch('/api/getgoods?fid=1', {
      method: 'get'
    })
      .then(response => response.json())
      .then(json => console.log(json))
      .catch(err => console.log('Request Failed', err)); 
  }
  postFetch() {
    fetch('/api/cartadd', {
      method: 'post',
      data: {
        type: 1
      }
    })
    .then(res => res.json())
    .then(res => console.log(111, res))
    .catch(err => console.log('Request Failed', err))
  }
  getMyFetch() {
    myGet('/api/getgoods?fid=1')
      .then(res => console.log(res))
      .catch(err => console.log(err))
  }
  posMytFetch() {
    myPost('/api/cartadd', {
      fid: 1
    })
    .then(res => console.log(111,res))
    .catch(err => console.log(err))
  }
  render() {
    return (
      <div>
        <div>演示通过axios发请求</div>
        <button onClick={()=>this.getFn()}>get请求</button>
        <button onClick={()=>this.postFn()}>post请求</button>
        <hr/>
        <button onClick={()=>this.getFetch()}>fetch-get请求</button>
        <button onClick={()=>this.postFetch()}>fetch-post请求</button>
        <hr/>
        <button onClick={()=>this.getMyFetch()}>get-fetch封装</button>
        <button onClick={()=>this.posMytFetch()}>post-fetch封装</button>
      </div>
    )
  }
}
